<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>拦截ip</title>
    <link rel="stylesheet" type="text/css" href="${applicationScope.basePath}/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="${applicationScope.basePath}/css/nav.css">
    <link rel="stylesheet" type="text/css" href="${applicationScope.basePath}/css/comments.css">
    <link href="${applicationScope.basePath}/css/font-awesome.css" rel="stylesheet"/>
    <script type="text/javascript" src="${applicationScope.basePath}/js/jquery-3.4.1.min.js"></script>
</head>
<body>
<jsp:include page="header.jsp" flush="true"/>
<div class="row" style="height: 100%;margin-top: -21px;">
    <div class="col-xs-2" style="height: 100%;margin-left: 0;">
        <div class="nav nav-pills nav-stacked">
            <div class="nav-top">
                <div id="mini" style="border-bottom:1px solid rgba(255,255,255,.1)"><img src="${applicationScope.basePath}/images/mini.png"></div>
            </div>
            <ul>
                <li class="nav-item"><a style="text-decoration: none;" href="${applicationScope.basePath}/admin/main"><i
                        class="icon icon-home"></i><span>首页</span></a></li>
                <li class="nav-item">
                    <a style="text-decoration: none;" href="javascript:;"><i
                            class="icon icon-group"></i><span>用户管理</span></a>
                    <ul>
                        <li><a style="text-decoration: none;" href="${applicationScope.basePath}/admin/userpage/1"><span>&emsp;&emsp;用户列表</span></a></li>
                    </ul>
                </li>
                <li class="nav-item">
                    <a style="text-decoration: none;" href="javascript:;"><i
                            class="icon icon-signal"></i><span>商品管理</span> </a>
                    <ul>
                        <li><a style="text-decoration: none;" href="${applicationScope.basePath}/admin/goodspage/1"><span>&emsp;&emsp;商品列表</span></a></li>
                    </ul>
                </li>
                <li class="nav-item">
                    <a style="text-decoration: none;" href="javascript:;"><i class="icon icon-th"></i><span>订单管理</span></a>
                    <ul>
                        <li><a style="text-decoration: none;" href="${applicationScope.basePath}/admin/orderspage/1"><span>&emsp;&emsp;订单列表</span></a></li>
                    </ul>
                </li>
                <li class="nav-item">
                    <a style="text-decoration: none;" href="javascript:;"><i
                            class="icon icon-inbox"></i><span>钱包管理</span></a>
                    <ul>
                        <li><a style="text-decoration: none;" href="${applicationScope.basePath}/admin/purse/page/1"><span>&emsp;&emsp;钱包列表</span></a></li>
                        <li><a style="text-decoration: none;" href="${applicationScope.basePath}/admin/withdrawals/page/1"><span>&emsp;&emsp;提现列表</span></a></li>
                        <li><a style="text-decoration: none;" href="${applicationScope.basePath}/admin/recharge/page/1"><span>&emsp;&emsp;充值列表</span></a></li>
                    </ul>
                </li>
                <li class="nav-item">
                    <a style="text-decoration: none;" href="javascript:;"><i
                            class="icon icon-fullscreen"></i><span>系统设置</span></a>
                    <ul>
                        <li><a style="text-decoration: none;" href="${applicationScope.basePath}/admin/sys"><span>&emsp;&emsp;发布信息</span></a></li>
                        <li><a style="text-decoration: none;" href="${applicationScope.basePath}/admin/password"><span>&emsp;&emsp;修改密码</span></a></li>
                        <li><a style="text-decoration: none;" href="${applicationScope.basePath}/admin/ipblack"><span>&emsp;&emsp;黑名单IP</span></a></li>
                    </ul>
                </li>
            </ul>
        </div>
    </div>
    <div class="col-xs-10 text-center">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="page-header">
                        <h1>IP管理</h1>
                    </div>
                    <div class="col-md-12">
                        <form id="ipblack" action="#">
                            <div class="col-md-10">
                                <input id="ip" class="form-control" required placeholder="请输入要添加的IP">
                            </div>
                            <div class="col-md-2">
                                <button id="reBtn" type="submit" class="btn btn-primary">添加</button>
                            </div>
                        </form>
                    </div>
                    <div class="col-md-11" style="margin-left: 15px;margin-top: 15px;">
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <span>黑名单IP</span>
                            </div>
                            <div class="panel-body">
                                <c:forEach items="${ipList}" var="item" varStatus="vs">
                                    <div style="margin-left: 5px;margin-top: 5px;"
                                         class="alert alert-info alert-dismissible pull-left" role="alert">
                                        <button type="button" class="close" onclick="rm(this,'${item}')">
                                            <span aria-hidden="true">&times;</span></button>
                                        <strong>${item}</strong>
                                    </div>
                                </c:forEach>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript" src="${applicationScope.basePath}/js/bootstrap.min.js"></script>
<script type="text/javascript" src="${applicationScope.basePath}/js/jquery.serializejson.js"></script>
<script type="text/javascript" src="${applicationScope.basePath}/js/nav.js"></script>

<script type="text/javascript">
    $("#ipblack").submit(function (encodedURIComponent) {
        const ip = $("#ip").val();
        $("#reBtn").button('loading');
        $.ajax({
            url: "${applicationScope.basePath}/admin/ipblack?ip="+ip,
            type: "POST",
            dataType: "json",
            contentType: "application/json;charset=UTF-8",
            success: function (data) {
                $("#reBtn").button('reset');
                if (data.flag) {
                    alert("添加成功");
                    location.reload();
                } else {
                    alert(data.errorMsg)
                }
            },
            error: function (data) {
                //跳转到错误页面
            }
        });
        return false;
    });

    function rm(obj,ip) {
        $.ajax({
            url: "${applicationScope.basePath}/admin/ipblack?ip="+ip,
            type: "DELETE",
            dataType: "json",
            contentType: "application/json;charset=UTF-8",
            success: function (data) {
                if(data.flag){
                    $(obj).parent().remove();
                }
            },
            error: function (data) {
                //跳转到错误页面
            }
        });
    }

</script>
</body>
</html>
